@media screen and (max-width: 872px) {
    .size-change {
        font-size: 1em!important;
    }

    .size-change2 {
        font-size: 2.4em!important;
    }

    .hoverzoom {
        margin-bottom: 15px!important;
    }

    #text-name {
        font-size: 4em;
    }

    #text-footer {
        text-align: center;
    }

    #divSocial {
        justify-content: center;
        margin-top: 8px;
    }

    #container-cards {
        height: 400px;
        margin-bottom: 40px;
    }

    .cards {
        height: 360px;
        width: 100%;
    }
    
    .label-slide {
        width: 260px;
        max-width: 300px;
    }

    #Cookies {
        width: 94%;
        max-width: 100%;
        position: fixed;
        bottom: 12px;
        right: 12px;
    }
    
    #email {
        width: 100%;
        margin-bottom: 10px;
        border-top-right-radius: var(--bs-border-radius)!important;
        border-bottom-right-radius: var(--bs-border-radius)!important;
    }

    #btnEnviar {
        width: 100%;
        border-bottom-left-radius: var(--bs-border-radius)!important;
        border-top-left-radius: var(--bs-border-radius)!important;
    }

    #s1:checked~.cards #slide1,
    #s2:checked~.cards #slide2,
    #s3:checked~.cards #slide3 {
        box-shadow: 0 15px 20px rgba(0,0,0, 0.3);
        transform: translate3d(-20%, 0, -80px);
        --current-color1: #eceaed;
        --current-color2: #404457;
    }


    /* #s1:checked~.cards #slide3,
    #s2:checked~.cards #slide1,
    #s3:checked~.cards #slide2 {
        box-shadow: 0 25px 40px rgba(0,0,0, 0.5);
        transform: translate3d(0, 0, 0);
        --current-color1: #fad00c;
        --current-color2: #eceaed;
    } */


    #s1:checked~.cards #slide2,
    #s2:checked~.cards #slide3,
    #s3:checked~.cards #slide1 {
        box-shadow: 0 15px 20px rgba(0,0,0, 0.3);
        transform: translate3d(20%, 0, -80px);
        --current-color1: #eceaed;
        --current-color2: #404457;
    }

    .icon-scale {
        font-size: 2em;
    }
}

@media (min-width: 873px) and (max-width: 1024px) {
    .size-change {
        font-size: 1.1em!important;
    }

    .size-change2 {
        font-size: 2.4em!important;
    }

    .hoverzoom {
        margin-bottom: 15px!important;
    }

    #text-name {
        font-size: 6em;
    }
}

@media (min-width: 1025px) and (max-width: 1920px) {
    #text-name {
        font-size: 6em;
    }

    #divSocial {
        justify-content: right;
    }
}